<template>
    <!-- 受益人 组件 -->
    <el-form>
        <el-row >
            <el-col :span="12">
                <el-form-item label="姓名" label-width="100px">
                    <el-input v-model="form.FAVOREE_NAME"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="与被保险人关系" label-width="100px">
                     <el-select v-model="form.FAVOREE_RELATION" placeholder="请选择性别" >
                                        <el-option label="父母" value="父母"></el-option>
                                        <el-option label="子女" value="子女"></el-option>
                                         <el-option label="配偶" value="配偶"></el-option>                                      
                                         <el-option label="其他" value="其他"></el-option>
                                    </el-select>  
                   
                </el-form-item>
            </el-col>
        </el-row>
        <el-row >
           <el-col :span="12">
                <el-form-item label="性别" label-width="100px">
                      <el-select v-model="form.FAVOREE_SEX" placeholder="请选择性别">
                                        <el-option label="男" value="男"></el-option>
                                        <el-option label="女" value="女"></el-option>
                                    </el-select>  
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="出生日期" label-width="100px">
                       <el-date-picker v-model="form.FAVOREE_BIRTHDAY" type="date" placeholder="出生日期"  >
                    </el-date-picker>  
                </el-form-item>
            </el-col>
             </el-row>
        <el-row >
            <el-col :span="12">
                <el-form-item label="证件类型" label-width="100px">
                     <el-select v-model="form.FAVOREE_STYLE" placeholder="请选择性别" >
                                        <el-option label="身份证" value="身份证"></el-option>
                                        <el-option label="军官证" value="军官证"></el-option>
                                         <el-option label="护照" value="护照"></el-option>
                                        <el-option label="驾驶执照" value="驾驶执照"></el-option>
                                         <el-option label="其他" value="其他"></el-option>
                                    </el-select>                  
                </el-form-item>
            </el-col>
           
        
           <el-col :span="12">
                <el-form-item label="证件号码" label-width="100px">
                    <el-input v-model="form.FAVOREE_NUMBER"></el-input>
                </el-form-item>
            </el-col>
            </el-row>
        <el-row >
            <el-col :span="12">
                <el-form-item label="移动电话" label-width="100px">
                    <el-input v-model="form.FAVOREE_TELPHONE"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="联系电话" label-width="100px">
                    <el-input v-model="form.FAVOREE_TEL"></el-input>
                </el-form-item>
            </el-col>
           
        </el-row>
         <el-row >
         <el-col :span="12">
                <el-form-item label="邮编" label-width="100px">
                    <el-input v-model="form.FAVOREE_ZIP"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="电子邮箱" label-width="100px">
                    <el-input v-model="form.FAVOREE_EMAIL"></el-input>
                </el-form-item>
            </el-col>
            </el-row>
        <el-row >
            <el-col :span="12">
                <el-form-item label="常住地址" label-width="100px">
                    <el-input v-model="form.FAVOREE_ADDRESS"  type="textarea"></el-input>
                </el-form-item>
            </el-col>
               </el-row>
                 <el-row >
                <el-col :span="8">
         <el-form-item label="份额" label-width="100px">
                    <el-input v-model="form.FAVOREE_PORTION"></el-input>
                </el-form-item>
                </el-col>
                   <el-col :span="16" style="line-height:30px;">
                      受益份额请填写1-100的自然数,多个受益人的,各受益人的份额总和不得超过100
                   </el-col>
                </el-row>
                <div style="text-align:center">
                   <el-button type="primary" @click="add">
                    添加
                   </el-button>
                </div>
    </el-form>
</template>

<script>
import { mapState } from "vuex";
import getid from "@/js/getid";
export default {
  data() {
    return {
      form: {
        FAVOREE_ID: "",
        FAVOREE_NAME: "",
        FAVOREE_RELATION: "",
        FAVOREE_SEX: "",
        FAVOREE_BIRTHDAY: "",
        FAVOREE_STYLE: "",
        FAVOREE_NUMBER: "",
        FAVOREE_TELPHONE: "",
        FAVOREE_TEL: "",
        FAVOREE_ZIP: "",
        FAVOREE_EMAIL: "",
        FAVOREE_ADDRESS: "",
        FAVOREE_PORTION: "",
        SALESDETAIL_ID: ""
      }
    };
  },
  computed: mapState({
    list: state => state.SealDetail.model.FAVOREEs
  }),
  methods: {
    add() {
      this.form.FAVOREE_ID = getid.getid();
      this.list.push(this.form);
      this.$emit("close");
    //   console.log(this.list);
    }
  },
  created() {}
};
</script>

<style>

</style>